import Vue from "vue";
import Router from "vue-router";
import Home from "../views/Home.vue";
import Layout from "../layout/"
Vue.use(Router);

//当设置 true 的时候该路由不会再侧边栏出现
//hidden: true 
//当设置 noRedirect 的时候该路由在面包屑导航中不可被点击
// redirect: 'noRedirect'
// 设置 alwaysShow: true，这样它就会忽略之前定义的规则，一直显示根路由
// alwaysShow: true
// meta{
//   breadcrumb: false // 如果设置为false，则不会在breadcrumb面包屑中显示
//   icon: 'svg-name' //设置该路由的图标
// }
//共用路由
export const constantRoutes=[
  {
    path: "/login",
    name: "login",
    component: ()=>import("../views/login/login.vue"),
    hidden: true
  },
  {
    path: "/",
    redirect:"/home", //navbar中头部点击路径
    component: Layout,
    children:[{
      path: 'home',
      name: "home",
      component:Home,
      meta: {
        auth: true,//是否需要登录认证
        title:"Home", //设置该路由在侧边栏和面包屑中展示的名字
        icon:"dashboard" //图标
      }
    }]
  }
]

export const asyncRoutes=[
  {
    path:'/users',
    component:Layout,
    redirect:'/users/roles',
    name:'Users',
    alwaysShow: true,
    meta:{
      title:'UserManage',
      icon:'user'
    },
    children:[
      {
        path:'roles',
        component: () => import('../views/user/role.vue'),
        meta:{
          title:'RoleManage',
          auth:true
        }
      }
    ]
  },
  {
    path: '/example',
    component: Layout,
    redirect: '/example/table',
    name: 'Example',
    alwaysShow: true,
    meta: { title: 'Example', icon: 'example' },
    children: [
      {
        path: 'table',
        name: 'Table',
        component: () => import('../views/example/table.vue'),
        meta: { title: 'Table', icon: 'table',auth:true }
      },
      {
        path:'step',
        name: 'step',
        component: () => import('../views/example/steps.vue'),
        meta:{
          title:'Step',
          auth:true,
          icon: 'form'
        }
      }
    ]
  },
  {
    path: '/nested',
    component: Layout,
    redirect: '/nested/menu1',
    name: 'Nested',
    meta: {
      title: 'Nested',
      icon: 'nested'
    },
    children: [
      {
        path: 'menu1',
        component: () => import('../views/Home.vue'), // Parent router-view
        name: 'Menu1',
        meta: { title: 'Menu1' },
        children: [         
          {
            path: 'menu1-1',
            component: () => import('../views/Home.vue'),
            name: 'Menu1-1',
            meta: { title: 'Menu1-1' }
          },
          {
            path: 'menu1-2',
            component: () => import('../views/Home.vue'),
            name: 'Menu1-2',
            meta: { title: 'Menu1-2' },
            children: [
              {
                path: 'menu1-2-1',
                component: () => import('../views/Home.vue'),
                name: 'Menu1-2-1',
                meta: { title: 'Menu1-2-1' }
              },
              {
                path: 'menu1-2-2',
                component: () => import('../views/Home.vue'),
                name: 'Menu1-2-2',
                meta: { title: 'Menu1-2-2' }
              }
            ]
          },
          {
            path: 'menu1-3',
            component: () => import('../views/Home.vue'),
            name: 'Menu1-3',
            meta: { title: 'Menu1-3' }
          }
        ]
      },
      {
        path: 'menu2',
        component: () => import('../views/Home.vue'),
        meta: { title: 'Menu2' }
      }
    ]
  }
] 

const createRouter=()=>new Router({
  mode: "history",
  base: process.env.BASE_URL,
  scrollBehavior: () => ({ y: 0 }),
  routes:constantRoutes
})
const route=createRouter()

export default route
